<!DOCTYPE html>
<html lang="en">
<head>
  <#import "/components/head.ftl" as head>
  <@head.HeadParams title="${title}" keywords="${keywords}" description="${description}" url="${serverHostPath}" image="${staticHostPath}/assets/img/logo-narrow.webp" />
  <link rel="stylesheet" href="${staticHostPath}/views/index/index.css">
  <link rel="stylesheet" href="${staticHostPath}/components/carousel/carousel.css">
  <link rel="stylesheet" href="${staticHostPath}/components/card/card.css">
</head>
<body>
  <div id="app" class="">
    <header class="container fixed-top" style="background: white;height: 4rem;">
      <#include "/components/navbar-top.ftl">
    </header>
    ${main}
    <footer class="container">
      <#include "/components/footer.ftl">
    </footer>
  </div>
</body>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" crossorigin="anonymous"></script>
<script src="${staticHostPath}/common/js/util.js"></script>
<script src="https://unpkg.com/vue@2.6.12/dist/vue.js"></script>
<script src="${staticHostPath}/views/index/index.js"></script>
</html>